<template>
  <view :data-theme="cueTheme">
    <basic-components />
    <custom-navbar title="当天任务" :left-icon="false" />

    <view class="task-box">
      <template v-if="dataGrid.data.length">
        <uni-swipe-action>
          <uni-swipe-action-item v-for="item of dataGrid.data" :key="item.id" class="table-box">
            <view class="table-row" :style="{ backgroundColor: item.selctColor }">
              <view class="left">
                <image class="image" :src="setImgUrl(item)" />
                <view class="left-value">
                  <view>{{ item.taskName }}</view>
                  <view class="type">
                    {{ item.taskType }}
                    <view class="priority">
                      <image v-for="i in item.priority" :key="i" class="image" src="~@/static/img/xing.png" />
                    </view>
                  </view>
                </view>
              </view>
              <view class="right">
                <view class="time" :class="[!item.surplusFlag ? 'error-time' : '']">
                  {{ item.status !== 0 ? item.surplus : item.planTime + ' ( 分钟 )' }}
                </view>
                <view class="f-r-center">
                  <image v-for="i in item.priority" :key="i" class="image" src="~@/static/img/xing.png" />
                </view>
              </view>
            </view>

            <template #right>
              <view v-if="item.status === 0" :style="options[0].style" class="op-box" @tap="clickRow(item, options[0])">
                {{ options[0].text }}
              </view>
              <view v-if="item.status === 5" :style="options[1].style" class="op-box" @tap="clickRow(item, options[1])">
                {{ options[1].text }}
              </view>
            </template>
          </uni-swipe-action-item>
        </uni-swipe-action>
      </template>
      <view v-else-if="dataGrid.loading !== 1" class="main-no-data">
        当天暂无任务
      </view>
    </view>

    <m-modal :visible.sync="dialogParams.visible" :content="dialogParams.content" :apis="dialogParams.apis"
      :use-flag="dialogParams.useFlag" :params="dialogParams.params" :select-row-data="dialogParams.selectRowData"
      @submit="modalSubmit" />
  </view>
</template>

<script>
import { getFiles } from "@/utils/getFiles"
const files = require.context("./mixins", false, /\.js$/)
const mixins = getFiles(files)
import scroll from "@/common/mixins/scroll"

export default {
  mixins: [...mixins, scroll],
  data() {
    return {
      options: [
        {
          text: "开始",
          style: {
            backgroundColor: this.$basicColor.success_color
          }
        },
        {
          text: "结束",
          style: {
            backgroundColor: this.$basicColor.del_color
          }
        }
      ]
    }
  },
  created() {
    this.search()
  },
}
</script>

<style lang="scss"  src="./index.scss"></style>

